<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
	name="viewport">
<link rel="stylesheet" href="<%=basePath%>statics/css/bootstrap-2.3.css">
<title>山西旅游网站</title>
</head>
<body>
	<div class="container-fluid">
		<div class="row-fluid">
			<div class="span12">
				<div class="row-fluid">
					<div class="span12">
						<div class="span4"></div>
						<div class="span4">
							<h3>华夏古文明-山西好风光----设计成图片</h3>
						</div>
						<div class="span4"></div>
					</div>
				</div>
				<div class="row-fluid">
					<div class="span2"></div>
					<div class="span8">
						<div class="navbar">
							<div class="navbar-inner">
								<div class="container-fluid">
									<a data-target=".navbar-responsive-collapse"
										data-toggle="collapse" class="btn btn-navbar"><span
										class="icon-bar"></span><span class="icon-bar"></span><span
										class="icon-bar"></span></a> <a href="<%=basePath%>front/index.jsp" class="brand">山西旅游网</a>
									<div class="nav-collapse collapse navbar-responsive-collapse">
										<ul class="nav">
											<li ><a href="<%=basePath%>front/index.jsp">主页</a></li>
											<li class="dropdown active"><a data-toggle="dropdown"
												class="dropdown-toggle" href="#">大好山西<strong
													class="caret"></strong></a>
												<ul class="dropdown-menu" id="citylistid">
												</ul>
											</li>
											<li class="dropdown"><a data-toggle="dropdown"
												class="dropdown-toggle" href="#">主要景点<strong
													class="caret"></strong></a>
												<ul class="dropdown-menu">
													<li><a href="#">五台山</a></li>
													<li><a href="#">平遥古城</a></li>
													<li><a href="#">云冈石窟</a></li>
													<li><a href="#">皇城相府</a></li>
													<li><a href="#">乔家大院</a></li>
													<li><a href="#">更多景点</a></li>
												</ul></li>
											<li class="dropdown"><a data-toggle="dropdown"
												class="dropdown-toggle" href="#">山水旅游<strong
													class="caret"></strong></a>
												<ul class="dropdown-menu" id="categorylistid">
												</ul>
											</li>
											<li></li>
											<li><a href="#">读图之美</a></li>
											<li><a href="#">留言板</a></li>
										</ul>
										<ul class="nav pull-right">

											<li><a href="#">游客登录</a></li>

										</ul>
									</div>

								</div>

							</div>
						</div>

					</div>
					<div class="span2"></div>
				</div>
				<div class="row-fluid">
					<div class="span12">
						<div class="row-fluid">
							<div class="span2"></div>

							<div class="span8">
								<div class="span3" style="border: 1px solid #ddd;">
									<ul class="nav nav-list" id="category_left_nav">
										<center>
											<h3>山水旅游</h3>
										</center>
										<li class="divider"></li>
									</ul>

								</div>
								<div class="span9" style="border: 1px solid #ddd;">

									<div class="content-head">
										<br>
										<div class="span0.5	">返回首页 > 概括 > ${category.name}</div>
										<div class="span0.5"></div>
									</div>

									<div class="container-fluid">
										<div class="row-fluid">
											<div class="span12">
												<ul class="thumbnails">
													<li class="span4">
														<div class="thumbnail">
															<img alt="300x200" src="img/people.jpg" />
															<div class="caption">
																<h3>
																	冯诺尔曼结构
																</h3>
																<p>
																	也称普林斯顿结构，是一种将程序指令存储器和数据存储器合并在一起的存储器结构。程序指令存储地址和数据存储地址指向同一个存储器的不同物理位置。
																</p>
																<p>
																	<a class="btn btn-primary" href="#">浏览</a> <a class="btn" href="#">分享</a>
																</p>
															</div>
														</div>
													</li>
													<li class="span4">
														<div class="thumbnail">
															<img alt="300x200" src="img/city.jpg" />
															<div class="caption">
																<h3>
																	哈佛结构
																</h3>
																<p>
																	哈佛结构是一种将程序指令存储和数据存储分开的存储器结构，它的主要特点是将程序和数据存储在不同的存储空间中，进行独立编址。
																</p>
																<p>
																	<a class="btn btn-primary" href="#">浏览</a> <a class="btn" href="#">分享</a>
																</p>
															</div>
														</div>
													</li>
													<li class="span4">
														<div class="thumbnail">
															<img alt="300x200" src="img/sports.jpg" />
															<div class="caption">
																<h3>
																	改进型哈佛结构
																</h3>
																<p>
																	改进型的哈佛结构具有一条独立的地址总线和一条独立的数据总线，两条总线由程序存储器和数据存储器分时复用，使结构更紧凑。
																</p>
																<p>
																	<a class="btn btn-primary" href="#">浏览</a> <a class="btn" href="#">分享</a>
																</p>
															</div>
														</div>
													</li>
												</ul>
											</div>
										</div>
									</div>
								</div>

							</div>
						</div>
						<div class="span2"></div>
					</div>
				</div>
			</div>


			<div class="row-fluid">
				<div class="span2"></div>
				<div class="span6">
					<center>Copyright 2018 Inc.All rights reserved. 旅游网 版权所有
						晋ICP备xxxxx号-1</center>
				</div>
				<div class="span4"></div>
			</div>
		</div>
	</div>
	</div>
</body>
</html>
<script src="<%=basePath%>statics/libs/jquery.min.js"></script>
<script src="<%=basePath%>statics/libs/vue.min.js"></script>
<script src="<%=basePath%>statics/libs/router.js"></script>
<script src="<%=basePath%>statics/libs/bootstrap.min.js"></script>
<script>
	$(function() {
		$('#carousel-339691').carousel({
			interval : 3000
		});
	});
    $.ajax({
        url : "<%=basePath%>api/tcity/list",
        data : "",
        success : function(data) {
            var json=JSON.parse(data).cityList;
            $.each(json, function(index, item) {
                var a='<li><a href="<%=basePath%>api/tcity/info?id='+item.id+'">'+item.cityName+'</a></li>';
                //var b='<li><a href="<%=basePath%>api/tcity/info?id='+item.id+'" class="text-center" style="border-bottom-style: solid;">' +
                    '<center><h5>'+item.cityName+'</h5></center></a></li>';
                $("#citylistid").append(a);
                //$("#city_left_nav").append(b);
            });
        }
    });
    $.ajax({
        url : "<%=basePath%>api/category/list",
        data : "",
        success : function(data) {
            var json=JSON.parse(data).categoryList;
            $.each(json, function(index, item) {
                var a='<li><a href="<%=basePath%>api/category/info?id='+item.id+'">'+item.name+'</a></li>';
                var b='<li><a href="<%=basePath%>api/category/info?id='+item.id+'" class="text-center" style="border-bottom-style: solid;">' +
					'<center><h5>'+item.name+'</h5></center></a></li>';
                $("#categorylistid").append(a);
                $("#category_left_nav").append(b);
            });
        }
    });
</script>
